<template>
  <div class="app-container" style="display: flex">
    <div class="detail-form">
      <el-form
        :model="form"
        :rules="rules"
        ref="form"
        label-width="auto"
        class="demo-form"
      >
        <el-form-item label=" 参诊企业编号" prop="companyNum">
          <el-input v-model="form.companyNum"></el-input>
        </el-form-item>
        <el-form-item label=" 现场记录编号" prop="recordNum">
          <el-input v-model="form.recordNum"></el-input>
        </el-form-item>
        <el-form-item label=" 诊断时间" prop="diagnosisTime">
          <el-input v-model="form.diagnosisTime"></el-input>
        </el-form-item>

        <el-form-item label=" 企业ID" prop="deptId">
          <el-input v-model="form.deptId"></el-input>
        </el-form-item>

        <h2>基础信息</h2>
        <el-form-item label=" 营业执照地址" prop="registerAddress">
          <el-input v-model="form.basisInfo.registerAddress"></el-input>
        </el-form-item>
        <el-form-item label=" 实际地址" prop="realAddress">
          <el-input v-model="form.basisInfo.realAddress"></el-input>
        </el-form-item>
        <el-form-item label=" 姓名" prop="realName">
          <el-input v-model="form.basisInfo.realName"></el-input>
        </el-form-item>
        <el-form-item label=" 手机号" prop="phone">
          <el-input v-model="form.basisInfo.phone"></el-input>
        </el-form-item>
        <el-form-item label=" 邮箱" prop="emai">
          <el-input v-model="form.basisInfo.emai"></el-input>
        </el-form-item>
        <el-form-item label=" 邮编" prop="postcode">
          <el-input v-model="form.basisInfo.postcode"></el-input>
        </el-form-item>
        <el-form-item label=" 电话" prop="telephone">
          <el-input v-model="form.basisInfo.telephone"></el-input>
        </el-form-item>
        <el-form-item label=" 总时长" prop="time">
          <el-input v-model="form.basisInfo.time"></el-input>
        </el-form-item>

        <h2>领域信息</h2>
        <el-descriptions direction="vertical" :column="4" border>
          <el-descriptions-item
            v-for="(item, index) in showItems"
            :key="index"
            :label="item.label"
          >
            <el-input-number
              v-model="item.value"
              placeholder="诊断时长"
              style="width: 100%"
            ></el-input-number>
          </el-descriptions-item>
        </el-descriptions>

        <el-form-item>
          <el-button type="primary" @click="submitForm('form')">保存</el-button>
          <el-button
            v-if="form.diagnosisId"
            plain
            icon="el-icon-edit"
            size="mini"
            @click="handleBegin()"
            >测评现场诊断</el-button
          >
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script>
import {
  getDiagnosis,
  addDiagnosis,
  updateDiagnosis,
} from "@/api/system/diagnosis";
import { treeselect2 } from "@/api/system/questiondomain";

import fileUpload2 from "@/components/FileUpload/index2";
export default {
  name: "enterpriseDetails",
  components: {
    fileUpload2,
  },
  props: {
    deptDatas: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      deptId: null,
      useFlag: null,
      showItems: [],
      form: {
        companyNum: "",
        recordNum: "",
        diagnosisTime: "",
        deptId: this.deptDatas.deptId,

        basisInfo: {
          registerAddress: "", //营业执照地址
          realAddress: "", //实际地址
          realName: "", //姓名
          phone: "", //手机号
          emai: "", //邮箱
          postcode: "", //邮编
          telephone: "", //电话
          time: "", //总时长
        }, //基础信息(ison字符串)
        domainInfo: "", //领域信息(ison字符串)
      },
      rules: {
        // staffNum: [
        //   { required: true, message: "请输入职工人数", trigger: "blur" },
        // ],
        // ipNum: [
        //   { required: true, message: "请输入知识产权总数", trigger: "blur" },
        // ],
        // patentNum: [
        //   { required: true, message: "请输入专利总数", trigger: "blur" },
        // ],
        // scNum: [
        //   { required: true, message: "请输入著作权总数", trigger: "blur" },
        // ],
        // brandNum: [
        //   { required: true, message: "请输入商标总数", trigger: "blur" },
        // ],
        // floorArea: [
        //   { required: true, message: "请输入占地面积", trigger: "blur" },
        // ],
        // plantArea: [
        //   { required: true, message: "请输入厂房面积", trigger: "blur" },
        // ],
      },
    };
  },
  created() {
    this.getTreeselect();
  },
  methods: {
    getTreeselect() {
      treeselect2(this.deptDatas.deptId, 103).then((response) => {
        this.domainOptions = response.data;
        console.log(this.domainOptions, "this.domainOptions");
        let showItems = [];
        let values = [
          5, 5, 10, 10, 5, 10, 10, 5, 5, 10, 20, 20, 10, 20, 5, 5, 10, 5, 5, 5,
        ];
        this.domainOptions.forEach((items) => {
          items.children?.forEach((item) => {
            item.children?.forEach((i) => {
              showItems.push(i);
            });
          });
        });
        console.log(showItems);
        showItems.forEach(
          (item, index) => !item.value && (item.value = values[index])
        );

        this.showItems = showItems;
        console.log(this.showItems, "sh");

        this.getDeptId();
      });
    },

    // 获取诊断企业id
    getDeptId() {
      console.log(this.deptDatas.deptId, "企业id");
      getDiagnosis(this.deptDatas.deptId)
        .then((res) => {
          if (res.data) {
            this.form = res.data;
            this.form.basisInfo = JSON.parse(res.data.basisInfo);
            this.showItems.forEach(
              (item) =>
                (item.value = parseInt(
                  JSON.parse(res.data.domainInfo).filter(
                    (i) => i.domainId == item.id
                  )[0].time
                ))
            );
            // JSON.parse(res.data.domainInfo).forEach((item) => {
            //   console.log(item, "item");

            //   this.showItems.forEach((i) =>
            //     i.id == item.domainId
            //       ? (i.value = parseInt(item.time))
            //       : (i.value = 0)
            //   );
            // });
            console.log(this.showItems, "this.showItemsthis.showItems");
          } else {
          }
        })
        .catch(() => {});
    },
    // 保存基本信息
    submitForm(formName) {
      console.log(this.form.fileList, "this.form");

      this.$refs[formName].validate((valid) => {
        if (valid) {
          console.log(this.form, this.showItems);
          let domainInfo = [];
          this.showItems.forEach((item) => {
            domainInfo.push({
              domainId: item.id,
              time: item.value,
            });
          });

          let params = {
            ...this.form,
            basisInfo: JSON.stringify(this.form.basisInfo),
            domainInfo: JSON.stringify(domainInfo),
          };
          if (params.diagnosisId) {
            //已有数据，调用修改
            updateDiagnosis(params).then((res) => {
              this.$notify({
                message: "修改成功",
                position: "top-right",
                type: "success",
              });
              this.$emit("okDraw");
              // this.$router.go(-1);
            });
          } else {
            addDiagnosis(params).then((res) => {
              this.$notify({
                message: "保存成功",
                position: "top-right",
                type: "success",
              });
              this.$emit("okDraw");
              // this.$router.go(-1);
            });
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },

    // 更新获取基本信息表单
    resertDetailForm() {
      getDiagnosis(this.deptDatas.deptId).then((res) => {
        this.form = res.data;
        this.$message({
          message: "保存成功",
          type: "success",
        });
      });
    },

    //测评问卷部分
    handleBegin() {
      this.$store.dispatch("tagsView/delView", this.$route);
      this.$router.push({
        name: "showQuestionnaire",
        query: {
          naireId: 103,
          domain: 12,
          compId: this.deptDatas.deptId,
          isDiagnosis: 1,
        },
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.detail-form {
  width: 100%;
  .el-form-item {
    margin-right: 65px;
  }
}
.formSty {
  display: flex;
}
</style>
